<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		
		<div id="app">
			<input type="text" v-model="message"/>
		</div>
		
		<script src="../js/vuejs-2.5.16.js" type="text/javascript" charset="utf-8"></script>
		
		<script type="text/javascript">
			const vue  = new Vue({
				el: "#app",
				data: {
					message:""
				},
				/*
				 监听器：
					1、用于监听data中的数据变化；
					2、当data中的数据发生变化的时候，就会触发监听器中的函数；
						2.1、监听器的函数方法名，必须是data中的字段
						2.2、监听的函数必须有返回值；
						2.3、监听中的参数val的值，代表的是变化后的值
				 */
				watch:{
					message:function(val){
						alert("message的数据变成了"+val)
					}
				}
			})
		</script>
		
	</body>
</html>
